﻿@model ViewModels.LogOn.LogonModel

<div class="clearfix pt-3">
    <!-- Nav tabs -->
    <ul zyf-tab-links class="nav nav-tabs nav-justified nav-tabs-colored" role="tablist">
        <li class="nav-item">
            <a class="nav-link" href="#_pwd" data-toggle="tab">
                <span class="fa fa-lock"></span> 账号密码
            </a>
        </li>
        <li class="nav-item">
            <a class="nav-link active" href="#_sms" aria-controls="message" role="tab" data-toggle="tab" style="color:red;">
                <span class="fa fa-mobile-alt"></span> 手机短信
            </a>
        </li>
    </ul>

    <!-- Tab panes -->
    <div style="min-height: 286px;" class="tab-content tab-content-border">
        <div class="tab-pane" id="_pwd">
        </div>
        <div class="tab-pane active" id="_sms">
        </div>
    </div>
</div>

<script>
    $(document).ready(function () {

        let $tab = $('[zyf-tab-links] a[data-toggle="tab"]');
        $tab.on('shown.bs.tab', function (e) {
            toggleTab("/LogOn/", e);
            //toggleTab("/LogOn/", getPrepage());

        })
        $tab.first().tab("show");
    })


    function toggleTab(urlPrefix, e) {

        var currentTabPanel = $($(e.target).attr('href')),
            previousTabPanel = $($(e.relatedTarget).attr('href')),
            currentTabId = currentTabPanel.get(0).id
            ;
        $.validator.unobtrusive.parse($(e.target).find('form'));
        $.ajax({
            url: urlPrefix + currentTabId,
            success: function (data) {
                previousTabPanel.html('');
                var $form = $(data);
                $.validator.unobtrusive.parse($form);
                if (window.onFormSubmit) {
                    $form.submit(onFormSubmit);
                }
                //$form.find('[zyf-logon-prepage]').val(prepage);
                currentTabPanel.html($form);
            },
            error: JqueryAjaxError
        })

    }

</script>
